{% extends 'cms/cms_base.html' %}

{% block title %}CMS用户管理{% endblock %}

{% block head %}
    <script src="{{ static("cms/js/createCMSUser.js") }}"></script>
{% endblock %}


{% block main_content %}
    <span style="float: left; font-size: large; color: black">共 {{ total }} 条数据</span>
    <div class="top-box-cu" style="float: right; padding-bottom: 5px;">
        <button class="btn btn-warning" data-toggle="modal" data-target="#addcmsuser-dialog">添加用户</button>
        <button type="button" class="btn btn-warning" id="refresh-btn" onclick="window.location.reload();">刷新</button>
    </div>
    <table class="table table-bordered">
        <thead>
            <tr>
                <th>用户名</th>
                <th>登录帐号</th>
                <th>邮箱</th>
                <th style="width: 110px;">手机号</th>
                <th style="width: 80px;">启用状态</th>
                <th style="width: 200px;">操作</th>
            </tr>
        </thead>
        <tbody>
            {% for cu in cmsusers %}
                <tr data-username="{{ cu.username }}" data-useraccount="{{ cu.useraccount }}" data-email="{{ cu.email }}" data-mobile="{{ cu.mobile }}" data-id="{{ cu.id }}">
                    <td>{{ cu.username }}</td>
                    <td>{{ cu.useraccount }}</td>
                    <td>{{ cu.email }}</td>
                    <td>{{ cu.mobile }}</td>
                    {% if cu.status == 1 %}
                        <td style="color: green;">启用</td>
                    {% elif cu.status == 0 %}
                        <td style="color: red;">禁用</td>
                    {% else %}
                        <td>{{cu.status}}</td>
                    {% endif %}
                    <td>
                        <button class="btn btn-default btn-xs edit-cmsuser-btn">编辑</button>
                        {% if cu.status == 1 %}
                            <button class="btn btn-warning btn-xs status-cmsuser-btn" id="disableBtn" value="0">禁用</button>
                        {% else %}
                            <button class="btn btn-primary btn-xs status-cmsuser-btn" id="enableBtn" value="1">启用</button>
                        {% endif %}
                        <button class="btn btn-danger btn-xs delete-cmsuser-btn" id="delete-cmsuser-btn">删除</button>
                        <button class="btn btn-default btn-xs resetPwd-btn">重置密码</button>
                    </td>
                </tr>
            {% endfor %}
        </tbody>
    </table>
    {{ pagination.links }}

    <!-- 新增 -->
    <div class="modal fade" id="addcmsuser-dialog" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true" onclick="location.reload();">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">添加/修改用户</h4>
                </div>
                <div class="modal-body">
                    <form action="" class="form-horizontal">
                        <div class="form-group">
                            <label class="col-sm-3 control-label"><a>*</a>用户名：</label>
                            <div class="col-sm-6">
                                <input maxlength="50" type="text" class="form-control" name="username" placeholder="用户名，最多50个字符">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label"><a>*</a>登录帐号：</label>
                            <div class="col-sm-6">
                                <input maxlength="50" type="text" class="form-control" name="useraccount" placeholder="登录帐号，最多50个数字、英文或横线">
                                <span style="color: red">登录帐号保存后不允许修改</span>
                            </div>
                        </div>
                        <div class="form-group" id="password-class">
                            <label class="col-sm-3 control-label"><a>*</a>密码：</label>
                            <div class="col-sm-6">
                                <input maxlength="20" minlength="6" type="password" class="form-control" name="pwd" placeholder="密码，6-20个字符">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">*邮箱：</label>
                            <div class="col-sm-6">
                                <input maxlength="50" type="text" class="form-control" name="email" placeholder="邮箱，最多50个字符">
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">*手机号：</label>
                            <div class="col-sm-6">
                                <input maxlength="11" type="text" class="form-control" name="mobile" placeholder="手机号">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal" onclick="location.reload();">关闭</button>
                    <button type="button" class="btn btn-primary" id="save-cmsuser-btn">保存</button>
                </div>
            </div>
        </div>
    </div>
{% endblock %}